@charset "UTF-8";
@use 'sass:math';
/*
   波浪太高了 , 怎么调整平滑一点呢 ?
   定义 $p 调整波浪的起伏度
   定义 $x 计算圆心的距离 , 控制横向偏移和纵向偏移
    - 半径和圆圈的偏移满足三角函数的关系 
 */
.box {
  height: 600px;
  border: 1px solid #ccc;
  mask: radial-gradient(50px at 50% 80px, #f40 100%, transparent 101%) calc(50% - 40px) 0/80px 100% repeat-x, radial-gradient(50px at 50% -30px, transparent 100%, #f40 101%) 50% 50px / 80px 100% repeat-x;
  -webkit-mask: radial-gradient(50px at 50% 80px, #f40 100%, transparent 101%) calc(50% - 40px) 0/80px 100% repeat-x, radial-gradient(50px at 50% -30px, transparent 100%, #f40 101%) 50% 50px / 80px 100% repeat-x;
}
